:root {
    --scroll-bar-height: 5px;
}
/*******************************************/
/****************HEADER BAR*****************/
/*******************************************/
.site-header-bar {
    top: 0;
    left: 0;
    height: 4.1em; /*Same as menu top position and header button height and width*/
    width: 100vw;
    max-width: 100vw;
    z-index: 50;
}

.logo-link {
    position: absolute;
    left: 0;
    padding: 10px 0 10px 10px;
    box-sizing: border-box;
    height: calc(100% - var(--scroll-bar-height));
    z-index: 50;
    display: none;
    top: var(--scroll-bar-height);
}
.logo-link.vismode-active{
    display: block;
}
#site-logo,
#site-logo-alt,
#site-logo-night,
#site-logo-alt-night {
    position: relative;
    top: 0;
    bottom: 0;
    margin: auto;
    max-height: 100%;
    max-width: 100%;
}
.nav-item-mobile-only{
    display: none;
}
.nav-item-desktop-only{
    display: block;
}

/*HEADER / WINDOW WIDTH VISIBILITY SETTINGS*/
/*MOBILE*/
@media only screen and (max-width: 600px) {
    .header-mobile {
        display: block;
    }

    .header-tablet {
        display: none;
    }

    .header-laptop {
        display: none;
    }

    .header-desktop {
        display: none;
    }
}

/*TABLET*/
@media only screen and (max-width: 1023px) {
    .nav-item-mobile-only {
        display: block;
    }

    .nav-item-desktop-only {
        display: none;
    }

    .header-mobile {
        display: none;
    }

    .header-tablet {
        display: block;
    }

    .header-laptop {
        display: none;
    }

    .header-desktop {
        display: none;
    }
}

/*LAPTOP*/
@media only screen and (max-width: 1300px) {
    .header-mobile {
        display: none;
    }

    .header-tablet {
        display: none;
    }

    .header-laptop {
        display: block;
    }

    .header-desktop {
        display: none;
    }
}

/*DESKTOP*/
@media only screen and (min-width: 1301px) {
    .header-mobile {
        display: none;
    }

    .header-tablet {
        display: none;
    }

    .header-laptop {
        display: none;
    }

    .header-desktop {
        display: block;
    }
}